<template>
	<view>
		<view class="row row-middle bottom-line small-my-wallet-draw-user">提现账户</view>
		<view class="small-my-menu-item-box row row-between-wrapper">
			<view class="row row-middle">
				<image src="../../static/img/my_wallet_draw/my_wallet_draw_wechat.png"></image>
				<view>微信</view>
			</view>
			<view>{{user.nickName}}</view>
		</view>
		<view class="row row-middle bottom-line small-my-wallet-draw-user">提现金额</view>
		<view class="row row-middle bottom-line small-my-wallet-draw-price">￥<input type="number" placeholder="请输入提现金额" :value="withdraw" /></view>
		<view class="row row-middle bottom-line small-my-wallet-draw-phone">
			<image src="../../static/img/my_wallet_draw/my_wallet_draw_phone.png"></image>
			<input type="number" placeholder="请输入手机号" :value="user.mobile" disabled="true" />
		</view>
		<view class="row row-between-wrapper bottom-line small-my-wallet-draw-verification-code">
			<view class="row  row-middle">
				<image src="../../static/img/my_wallet_draw/my_wallet_draw_verification_code.png" class="icon"></image>
				<input type="number" placeholder="请输入验证码" />
			</view>
			<view class="row row-between-wrapper">
				<view>7653</view>
				<view class="next-code">
					<view>看不清楚？</view>
					<view>换一个</view>
				</view>
			</view>
		</view>
		<view class="row row-between-wrapper small-my-wallet-draw-verification-code">
			<view class="row row-middle">
				<image src="../../static/img/my_wallet_draw/my_wallet_draw_password.png" class="icon"></image>
				<input type="number" placeholder="请输入手机验证码"  />
			</view>
			<view class="get-code">获取验证码</view>
		</view>
		<view class="get-money">提现</view>
		<view>*最低提现额度10元</view>
		<view class="bottom-info row row-center-wrapper">
			<view></view>
			<view>如有疑问请联系客服</view>
			<view></view>
		</view>
	</view>
</template>

<script>
import http from '../../api/api.js';	
export default {
	data: function() {
		return {
			userId:uni.getStorageSync('userId'),
			user:{},
			stream:'',
			withdraw:0
		};
	},
	onLoad() {
		this.init({userId:this.userId})
	},
	methods: {
		init(data){
			http.getUserInfo(data).then(res => {
				if (res.data.code === 1) {
					this.user = res.data.data;
				}
			});
			let uuid = new Date().getTime();
			http.getVerificationCode({uuid:uuid}).then(res =>{
				console.log(res)
			})
		},
	}
};
</script>

<style lang="scss" scoped>
.small-my-wallet-draw-user {
	height: 80upx;
	background-color: #ffffff;
	padding: 0 20upx;
	font-size: 30upx;
}
.small-my-wallet-draw-price {
	font-size: 45upx;
	padding: 0 20upx;
	background-color: #ffffff;
}
.small-my-wallet-draw-phone {
	height: 80upx;
	padding: 0 20upx;
	background-color: #ffffff;
	> image {
		width: 44upx;
		height: 44upx;
		& + input {
			margin-left: 20upx;
			width: 80%;
		}
	}
}
.small-my-menu-item-box {
	padding: 0 20upx;
	margin-bottom: 20upx;
	background-color: #ffffff;
	height: 90upx;
	> view {
		position: relative;
		> image {
			width: 44upx;
			height: 44upx;
		}
		:nth-child(2) {
			margin-left: 20upx;
		}
		& + view {
			color: #a2a2a2;
		}
	}
}
.small-my-wallet-draw-verification-code {
	padding: 0 20upx;
	background-color: #ffffff;
	height: 100upx;
}
.small-my-wallet-draw-verification-code-left {
	:first-child {
		width: 44upx;
		height: 44upx;
	}
	:nth-child(2) {
		margin-left: 20upx;
	}
}
.small-my-wallet-draw-verification-code-right {
	width: 30%;
}
.icon{
	width: 44upx;
	height: 44upx;
	& + input{
		margin-left: 20upx;
		width: 80%;
	}
}
.next-code{
	margin-left: 20upx;
	:first-child{
		color: gray;
	}
	
}
.get-code{
	padding: 10upx 40upx;
	background-color: black;
	color: #FEE3AE;
	border-radius: 50upx;
}
.get-money{
	width: 80%;
	margin: 100upx auto 20upx;
	padding: 10upx 40upx;
	background-color: black;
	color: #FEE3AE;
	text-align: center;
	border-radius: 50upx;
	& + view{
		text-align: center;
	}
}
.bottom-info{
	margin-top: 200upx;
	color: #A5A5A5;
	:first-child{
		border-bottom: 1upx solid #A5A5A5;
		width: 100upx;
	}
	:nth-child(2){
		margin: 0 20upx;
	}
	:last-child{
		border-bottom: 1upx solid #A5A5A5;
		width: 100upx;
	}
}
</style>
